﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>添加车间设置</title>
  <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
   <link href="~/libs/layui-v2.5.6/layui/css/layui.css" rel="stylesheet"  />
</head>
<body>
    <form class="layui-form" action="">
        @* 样式 *@
        <div>
            <div class="layui-form-item">
                <label class="layui-form-label">车间编码</label>
                <div class="layui-input-block">
                    <input type="text" name="workShopCode" lay-verify="required" placeholder="请输入车间编码" autocomplete="off" style="width:300px" class="layui-input">
                     <input type="checkbox" lay-skin="switch" lay-filter="switchTest">自动生成
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">车间名称</label>
                <div class="layui-input-block">
                    <input type="text" name="workShopName" lay-verify="required" placeholder="请输入车间名称" autocomplete="off" style="width:300px" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">面积</label>
                <div class="layui-input-inline" style="width: 100px;">
                    <input type="number" name="area" lay-verify="required" placeholder="请输入面积" autocomplete="off" class="layui-input" min="0" step="1" lay-affix="number">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">负责人</label>
                <div class="layui-input-block">
                    <input type="text" name="principal" lay-verify="required" placeholder="请输入负责人" autocomplete="off" style="width:300px" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">是否启用</label>
                <div class="layui-input-block">
                    <input type="radio" name="isTrue" id="isTrue" value="true" title="是" checked>
                    <input type="radio" name="isTrue" id="isFalse" value="false" title="否">
                </div>
            </div>

        </div>

        <!-- 二维码区域 -->
        <div>
            <div class="qrcode" hidden="hidden">
                <img id="workShopPic" src="" alt="二维码" style="width: 200px; height: 200px;">
            </div>
        </div>


        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入内容" name="remark" class="layui-textarea"></textarea>
            </div>
        </div>

      


        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="submit" class="layui-btn" lay-submit lay-filter="demo1">添加</button>
                <button type="button" class="layui-btn layui-btn-primary" id="btnBack" onclick=returnList()>返回</button>
            </div>
        </div>
    </form>

    <!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
    <script src="~/libs/jquery/jquery.js"></script> 
    <script src="~/libs/layui-v2.5.6/layui/layui.js"></script>
    <script>
        layui.use(['form', 'laydate', 'util'], function () {
            var form = layui.form;
            var layer = layui.layer;
            var laydate = layui.laydate;
            var util = layui.util;
            // 监听复选框变化，自动生成客户编码
            form.on('switch(switchTest)', function (data) {
                if (data.elem.checked) {
                    // 生成随机字母+数字的编码并设置到CustomerCode输入框中
                    var randomNum = Math.floor(Math.random() * 10) + '';
                    for (var i = 0; i < 2; i++) {
                        randomNum += Math.floor(Math.random() * 10);
                    }
                    randomNum = 'CJ00' + randomNum;
                    $('input[name="workShopCode"]').val(randomNum);

                }
                else {
                    $('input[name="workShopCode"]').val('');
                }
            });

            // 自定义验证规则
            form.verify({
                pass: function (value) {
                    if (!/(.+){6,12}$/.test(value)) {
                        return '密码必须 6 到 12 位';
                    }
                }
            });


            // 提交事件
            form.on('submit(demo1)', function (data) {
                console.log(22,data);
                var field = data.field; // 获取表单字段值
                // 转换成int类型
                field.area = parseInt(field.area);
                field.isTrue = field.isTrue == "true"? true : false; // 将字符串转为布尔类型
                field.workShopPic= ("车间编码=" + field.workShopCode + ",车间名称=" + field.workShopName + ",面积=" + field.area+",负责人"+field.principal+",是否启用="+field.isTrue+",备注="+field.remark).toString();

                // 发送Ajax请求
                $.ajax({
                    url: "/WorkshopsSetups/CreateWorkshopSetup",
                    data: field,
                    type: "post",
                    datatype: "json",
                    success: function (res) {
                        if (res == 1) {
                            //延时加载返回列表页面
                            setTimeout(function () {
                               returnList();
                            }, 500);
                            layer.msg('添加成功');
                        } 
                        else if (res == -1) {
                            layer.msg('该车间编码已存在');
                        }
                        else {
                             layer.msg('添加失败');
                        }
                    }
                })
                return false; // 阻止默认 form 跳转
            });

         

        });

          //返回列表页面
            function returnList() {
                 //在当前iframe => 关闭当前iframe 
                  var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                  parent.layer.close(index); //再执行关闭
            }
    </script>

</body>
</html>
